import { isRef } from 'vue';
import { ElMessage } from 'element-plus';
import { useForm } from '@/hooks/useForm.js';
import { useDialog } from '@/hooks/useDialog.js';

/**
 * 模态框与表单 结合使用
 * @param {object} _formData 表单对象
 * @param {RefImpl} disabledbtn 按钮可用与不可用 (不是ref的话，不做操作)
 * @param {function or '' or undefined} handleCustomOperation 自定义执行函数（如：用于关闭弹框时的后续操作）
 * @param {RefImpl} formLoading 表单loading状态 (不是ref的话，不做操作)
 * @param {string or undefined} _dialogTitle 模态框的标题名称
 * @param {boolean or undefined} _closeOnClickModal 是否可以点击空白区域关闭模态框
 * @returns
 */
export const useDialogForm = (_formData, disabledbtn, handleCustomOperation, formLoading,
  _dialogTitle, _closeOnClickModal) => {

  const { formRef, formData, methodType, isDisabledbtn,
    handleClearData, submitFormInfo: _submitFormInfo, handleFormValid } = useForm(_formData, formLoading);

  const { closeOnClickModal, dialogTitle, editVisible,
    closedFormDialog: _closedFormDialog } = useDialog(_dialogTitle, _closeOnClickModal);

  /* 关闭弹框 */
  function closedFormDialog () {
    handleClearData();
    _closedFormDialog();
    handleCustomOperation && handleCustomOperation();
  }

  /**
   * 表单的保存或编辑
   * @param {string} method 新增与编辑的方法名称
   * @param {function} refreshMethod 刷新表单的方法名称
   * @param {function or undefined} handleValidAssignment 额外操作：如自定义校验，数据处理(赋值)
   * handleValidAssignment有4种情况
   * 1.没有传，2.传了，但是没有返回值 undefined，3.传了，返回值是 false 和 true 
   */
  const submitForm = (method, refreshMethod, handleValidAssignment) => {
    handleFormValid(handleValidAssignment).then(async () => {
      isRef(disabledbtn) && (disabledbtn.value = true);
      isRef(formLoading) && (formLoading.value = true);
      try {
        const res = await _submitFormInfo(method);
        ElMessage.success(res.msg);
        editVisible.value = false;
        /* 重新刷新数据 */
        refreshMethod && refreshMethod();
        /* 自定义操作，如一些非表单字段的初始化操作 */
        handleCustomOperation && handleCustomOperation();
      } catch (error) { console.log(error); } finally {
        isRef(disabledbtn) && (disabledbtn.value = false);
        isRef(formLoading) && (formLoading.value = false);
      }
    }).catch((res) => {
      console.log(res);
    });
  }

  return {
    formRef, formData, methodType, isDisabledbtn,

    closeOnClickModal, dialogTitle, editVisible,
    closedFormDialog,

    submitForm
  }
}